<template>
  <div class="container">
    <vxe-table
      border
      resizable
      max-height="400"
      align="center"
      :loading="loading"
      auto-resize
      :scroll-y="{enabled: false}"
      :data="tableData">
      <vxe-table-column field="orderNum" width="60" title="序号"></vxe-table-column>
      <vxe-table-column field="status" title="状态" :formatter="({ cellValue }) => this.getEnumsOrDict('dict', 'pickingGoodsStatus').get(String(cellValue))" />
      <vxe-table-column field="code" title="订单号"></vxe-table-column>
      <vxe-table-column field="deliveryOrderCode" title="原始单号"></vxe-table-column>
      <vxe-table-column field="sourcePlatformName" title="销售平台"></vxe-table-column>
      <vxe-table-column field="receiverName" title="收货客户"></vxe-table-column>
      <vxe-table-column field="goodsSortQuantity" title="商品种数"></vxe-table-column>
      <vxe-table-column field="totalNum" title="商品数量"></vxe-table-column>
      <vxe-table-column field="distributionNum" title="分配数量"></vxe-table-column>
      <vxe-table-column field="pickNum" title="拣货数量"></vxe-table-column>
      <vxe-table-column field="gmtCreated" title="接收时间"></vxe-table-column>
      <vxe-table-column field="waybillPrintCount" title="打印次数" width="80"></vxe-table-column>
      <vxe-table-column title="操作" fixed="right" width="80">
        <template slot-scope="scope" v-if=" operation != 'detail' ">
          <el-tooltip class="item" effect="dark" content="解除" placement="top">
            <vxe-button type="text" @click="relieve(scope.row.code)">
              <i class="el-icon-minus" />
            </vxe-button>
          </el-tooltip>
        </template>
        <template slot-scope="scope" v-if=" operation === 'detail' && scope.row.status != '4'">
          <el-tooltip class="item" effect="dark" content="打印" placement="top">
            <vxe-button type="text" @click="printExpressBill(scope.row.code)">
              <i class="el-icon-printer"/>
            </vxe-button>
          </el-tooltip>
        </template>
      </vxe-table-column>
    </vxe-table>
     <vxe-pager
      :loading="loading"
      :current-page.sync="listQuery.pageNum"
      :page-size.sync="listQuery.pageSize"
      :total="listQuery.total"
      :layouts="['PrevJump', 'PrevPage', 'Number', 'NextPage', 'NextJump', 'Sizes', 'FullJump', 'Total']"
      @page-change="handlePageChange"
    />
  </div>
</template>

<script>
import Qs from 'qs'
import { queryDeliverylistByWave, releaseRelationWithPickingItem, printExpress } from "@/api/outStorage";
import soonPrint from '@/components/Printing/printBefore.js'
export default {
  name: "OrderList",
  components: {},
  props: {
    operation: {
      type: String,
      default: 'edit'
    },
  },
  data() {
    return {
      // code: this.$route.query.wavePickingCode,
      tableData: [],
      loading: false,
      listQuery:{
        total: 0,
        pageNum: 1,
        pageSize: 10,
        wavePickingCode: this.$route.query.wavePickingCode,
      }
    };
  },
  computed: {},
  watch: {},
  created() {
    this.getOrderList();
    window.onstorage = ({key}) => {
      if (key.indexOf('printComplete') != -1) {
        this.$message.success('打印任务执行完毕~')
        this.getOrderList()
        localStorage.removeItem(key)
      }
    }
  },
  mounted() {},
  methods: {
    // 订单列表
    getOrderList() {
      this.loading = true;
      queryDeliverylistByWave(Qs.stringify(this.listQuery)).then(response => {
        this.loading = false;
        this.tableData = response.data.records;
        this.listQuery.total =  response.data.total
        this.$emit('setOrderNum', response.data.total)
      });
    },
    // 解除
    relieve(code) {
      releaseRelationWithPickingItem(Qs.stringify({code})).then(res => {
        this.getOrderList();
        let msgType = res.status === 0 ? 'success' : 'warning'
        this.$message[msgType](res.msg)
        this.$eventBus.$emit('refreshGoodList')
      });
    },
    // 打印面单
    printExpressBill(code) {
        localStorage.setItem('printCode', JSON.stringify([code]))
        let routeUrl = this.$router.resolve({
          path: '/printResult',
          query: {
            type: 'array',
            listInterface: 'printExpress'
          }
        })
        // window.open(routeUrl.href, '_blank')
        soonPrint(routeUrl.href)
      // printExpress([code]).then(res => {
      //   if (res.status === 0) {
      //     if (res.data.length>0) {
      //       new PrintWaybill({ printData: res.data }, ()=>{
      //         this.getOrderList()
      //       }).initSocket()
      //     } else {
      //       this.$message.warning('没有打印数据不可打印！')
      //     }
      //   } else {
      //     this.$message.error(res.msg)
      //   }
      // })
    },
    // 分页
    handlePageChange({ currentPage, pageSize }) {
      this.listQuery.pageNum = currentPage
      this.listQuery.pageSize = pageSize
      this.getOrderList()
    },
    // 通用行合并函数（将相同多列数据合并为一行）
    mergeRowMethod({ row, _rowIndex, column, visibleData }) {
      const fields = ["key"];
      const cellValue = row[column.property];
      if (cellValue && fields.includes(column.property)) {
        const prevRow = visibleData[_rowIndex - 1];
        let nextRow = visibleData[_rowIndex + 1];
        if (prevRow && prevRow[column.property] === cellValue) {
          return { rowspan: 0, colspan: 0 };
        } else {
          let countRowspan = 1;
          while (nextRow && nextRow[column.property] === cellValue) {
            nextRow = visibleData[++countRowspan + _rowIndex];
          }
          if (countRowspan > 1) {
            return { rowspan: countRowspan, colspan: 1 };
          }
        }
      }
    }
  }
};
</script>
<style scoped>
.container {
}
</style>
